<style>
    #oilPrice-add {
        padding: 20px 25px 25px 0;
    }
    #oilPrice-add .layui-treeSelect .ztree li a, .ztree li span {
        margin: 0 0 2px 3px !important;
    }
</style>
<div class="layui-fluid" id="oilPrice-add">
    <form class="layui-form" action="" lay-filter="oilPrice-add-form">
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">变价日期：</label>
            <div class="layui-input-block">
                <input type="text" name="fromDate" lay-verify="required|date" minlength="2" maxlength="10"
                       autocomplete="off" id="fromDate1" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">变价时间：</label>
            <div class="layui-input-block">
                <input type="text" name="fromTime" lay-verify="required|time" id="fromTime1" autocomplete="off" class="layui-input">
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label">92#价格：</label>
            <div class="layui-input-block">
                <input type="text" name="oil92" lay-verify="money" maxlength="50" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label">95#价格：</label>
            <div class="layui-input-block">
                <input type="text" name="oil95" lay-verify="money" class="layui-input">
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label">0#价格：</label>
            <div class="layui-input-block">
                <input type="text"  name="oil0" lay-verify="money"  class="layui-input">
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">变价油站：</label>
            <div class="layui-input-block">
                <select name="siteCode"
                        lay-verify="required"
                        xm-select-direction="down"
                        xm-select="oilPrice-add-site"
                        xm-select-skin="default"
                        xm-select-show-count="2"
						>
                </select>
            </div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">上传附件：</label>
            <div class="layui-input-block">
            	<button type="button" class="layui-btn layui-btn-normal" id="checkFile">选择文件</button>
                <button type="button" class="layui-btn" id="priceFile">
				  <i class="layui-icon">&#xe67c;</i>上传图片
				</button>
            </div>
            <div class="layui-form-item febs-hide">
			            <label class="layui-form-label febs-form-item-require">图片地址：</label>
			            <div class="layui-input-block">
			                <input type="text" name="fileUrl" id="fileUrl" value="">
			            </div>
			</div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label">调价周期：</label>
            <div class="layui-input-block">
			    <input type="text" name="priceText" placeholder="年   月，第   轮调价 " autocomplete="off" class="layui-input">
			</div>
        </div>
        
        <div class="layui-form-item">
            <label class="layui-form-label">图片预览：</label>
            <div class="layui-input-block">
			    <img class="layui-upload-img" id="demo1" style="max-width: 196px">
			    <p id="demoText"></p>
			</div>
        </div>
        

        <div class="layui-form-item febs-hide">
        <input type="hidden" name="priceType" value="1" class="layui-input">
            <button class="layui-btn" lay-submit="" lay-filter="oilPrice-add-form-submit" id="submit"></button>
            <button type="reset" class="layui-btn" id="reset"></button>
        </div>
    </form>
</div>

<script>
    layui.use(['febs', 'laydate', 'element', 'upload', 'form', 'formSelects', 'treeSelect'], function () {
        var $ = layui.$,
        	laydate = layui.laydate,
            febs = layui.febs,
            layer = layui.layer,
            upload = layui.upload,
            formSelects = layui.formSelects,
            treeSelect = layui.treeSelect,
            element = layui.element,
            form = layui.form,
            $view = $('#oilPrice-add');

        form.verify({
			money: function(val, item) {
				if(!/^\d+(\.\d{0,2})?$/.test(val)){
					return '请输入正确的格式,小数点后保留两位'
				}
			}
		});
        
        form.render();

        formSelects.render();

        laydate.render({
            elem: '#fromDate1',
            type: 'date',
            trigger: 'click'
        });
        
        laydate.render({
            elem: '#fromTime1',
            type: 'time',
            trigger: 'click'
        });
        
        upload.render({
        	  elem: '#checkFile'
        	  ,url: ctx + 'uploadFile/file/price' //必填项
        	  ,accept:'images'
        	  ,acceptMime: 'image/jpg,image/png,image/jpeg'
        	  ,exts: 'jpg|png|jpeg'
        	  ,size: 2048
        	  ,field:"file"
        	  ,auto: false
        	  ,bindAction: '#priceFile'
        	  ,before: function(obj){
        	      //预读本地文件示例，不支持ie8
        	      febs.view.loadBar.start();
        	    }
        	 ,done: function(res){
        		febs.view.loadBar.finish();
	            layer.msg("上传成功！");
	            $('#fileUrl').attr('value', res.data);
	            $('#demo1').attr('src', res.data); //图片链接（base64）
	          }
        	});

        formSelects.config('oilPrice-add-site', {
            searchUrl: ctx + 'dictsite/station',
            response: {
                statusCode: 200
            },
            beforeSuccess: function (id, url, searchVal, result) {
                var data = result.data;
                var tranData = [];
                for (var i = 0; i < data.length; i++) {
                    tranData.push({
                        name: data[i].stationName,
                        value: data[i].stationCode
                    })
                }
                result.data = tranData;
                return result;
            },
            error: function (id, url, searchVal, err) {
                console.error(err);
                febs.alert.error('获取油站列表失败');
            }
        });

        form.on('submit(oilPrice-add-form-submit)', function (data) {
            febs.post(ctx + 'oilprice', data.field, function () {
                layer.closeAll();
                $('#febs-oilPrice').find('#pricequery').click();
            });
            return false;
        });
    });
</script>